<template>
	<view>
		<view class="navbar" :style="{'background': background, 'color': color}">
			<view :style="'width: 100%; height:' + height + 'rpx;'"></view>
			<view style="position: absolute; z-index: 1; width: 100%; text-align: center;">{{text}}</view>
			<view class="navbar_n flx">
				<view class="flxAlign" v-if='isTrue'>
					<!-- <u-icon name="photo" color="#2979ff" size="28"></u-icon> -->
					<u-icon @click="fh" name='arrow-left' size='28' :color='colors'></u-icon>
				</view>
				<view class="flx2 flxEnd" @click="end">
					 <slot name="title"></slot>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		props:{
			isTrue:{
				type: Boolean,
				default: true
			},
			text:{
				type: String,
				default: '模拟数据一'
			},
			background:{
				type: String,
				default: '#099dfd'
			},
			color:{
				type: String,
				default:'#fff'
			},
			colors:{
				type: String,
				default:'#fff'
			},
			height:{
				type: String,
				default:'20'
			} 
		},
		data(){
			return{
				
			}
		},
		methods:{
			fh(){
				uni.navigateBack()
			},
			end(){
				this.$emit('end')
			}
		}
	}
</script>

<style scoped lang="scss">
	.navbar{
		width: 100%;
		position: fixed;
		top: 0;
		z-index: 99;
		text-align: center;
		line-height: 100rpx;
	}
	.navbar_n{
		position: relative;
		width: 95%;
		height: 100rpx;
		margin-left:2.5%;
		z-index: 1000;
	}
</style>